<%--
  Created by IntelliJ IDEA.
  User: bi
  Date: 2019/1/3
  Time: 9:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
    <title>Title</title>
    <link type="text/css" rel="stylesheet" href="/css/style.css" />
    <style type="text/css">
        .red{border-color:#FF0033;}
        .cler{border-color:#00FF00;}
        #div {display:inline; margin-left:8px; color:red}
    </style>
</head>
<body onload="getValue()">
<div class="menu">
    <%
        String payStatus="";
        if(request.getParameter("payStatus")!=null)
            payStatus=request.getParameter("payStatus");
    %>
    </head>
    <form method="post" action="<%=request.getContextPath() %>/BillServlet?action=fenye" >
        商品名称：<input type="text" name="productName" class="input-text" />&nbsp;&nbsp;&nbsp;&nbsp;
        是否付款：<select name="payStatus">
        <option value="">请选择</option>
        <option value="1" <%=(payStatus.equals("1")?"selected":"") %> >已付款</option>
        <option value="0" <%=(payStatus.equals("0")?"selected":"") %> >未付款</option>
    </select>&nbsp;&nbsp;&nbsp;&nbsp;
        <input type="submit" value="组合查询" class="button" />
    </form>
</div>
<div class="main">
    <div class="optitle clearfix">
        <div class="title">账单管理&gt;&gt;</div>
    </div>
    <form method="post" action="/BillServlet?action=add" onsubmit="return check()">
        <div class="content">
            <table class="box">
                <tr>
                    <td class="field">商品编号：</td>
                    <td><input type="text" id="productId" name="productId"/> <font color="red" id="msgName1">*</font>
                    </td>
                </tr>

                <tr>
                    <td class="field">商品名称：</td>
                    <td><input type="text" id="productName" name="productName" onfocus="updateRed('productName')" onblur="checkName()"  /> <font color="red" id="msgName2">*</font><div id="div1"></div>
                    </td>
                </tr>
                <tr>
                    <td class="field">交易金额：</td>
                    <td><input type="text" id="billMoney" name="billMoney" onfocus="updateRed('billMoney')" onblur="checkMoney()"/> <font color="red" id="msgMonery">*</font><div id="div2"></div>
                    </td>
                </tr>
                <tr>
                    <td class="field">交易单位：</td>
                    <td><input type="text" id="unit" name="unit" onfocus="updateRed('unit')" onblur="checkUnit()"/> <font color="red" id="msgUnit">*</font><div id="div3"></div>
                    </td>
                </tr>
                <tr>
                    <td class="field">交易数量：</td>
                    <td><input type="text" id="counts" name="counts" onfocus="updateRed('counts')" onblur="checkCounts()"/> <font color="red" id="msgCounts">*</font><div id="div4"></div>
                    </td>
                </tr>
                <tr>
                    <td class="field">商品描述：</td>
                    <td><textarea name="productDesc" id="productDesc" ></textarea></td>
                </tr>
                <tr>
                    <td class="field">是否付款：</td>
                    <td><select name="isPay">
                        <option value="1">是</option>
                        <option value="0">否</option>
                    </select></td>
                </tr>
                <tr>
                    <td class="field">供应商：</td>
                    <td><select name="providerId">
                        <c:forEach items="${providers }" var="provider">
                            <option value="${provider.id }">${provider.name }</option>
                        </c:forEach>
                    </select>
                    </td>
                </tr>
            </table>
        </div>
        <div class="buttons">
            <input type="submit" name="submit" value="提交" class="input-button" />
            <input type="button" name="button" value="返回" class="input-button" onclick="history.back();" />
        </div>
    </form>
</div>
</body>
<script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
    function updateRed(Obj){
        if($.trim($("#"+Obj).val())==""){
            $("#"+Obj).val("");
            $("#"+Obj).addClass("red");
        }
    }

    /*
    * 非空验证
    */
    function checkName(){
        var productName=$("#productName").val();
        var msg=$("#msgName");
        var reg=/^[0-9]+$/;
        msg.html("");
        if(productName==null || $.trim(productName)==""){
            msg.html("*号为必填项");
            $("#productName").removeClass("cler");
            $("#productName").addClass("red");
            return false;
        }
        if(reg.test(productName)){
            msg.html("请输入正确的商品名称！");
            $("#productName").removeClass("cler");
            $("#productName").addClass("red");
            return false;
        }
        $("#productName").addClass("cler");
        return true;
    }
    function checkMoney(){
        var money=$("#billMoney").val();
        var msg=$("#msgMonery");
        var reg=/^(([1-9]+)|([0-9]+\.[0-9]{1,2}))$/;
        msg.html("");
        if(money==null || $.trim(money)==""){
            msg.html("*号为必填项");
            $("#billMoney").removeClass("cler");
            $("#billMoney").addClass("red");
            return false;
        }
        if(!reg.test(money)){
            msg.html("请输入正确的交易金额！");
            $("#billMoney").removeClass("cler");
            $("#billMoney").addClass("red");
            return false;
        }

        $("#billMoney").addClass("cler");
        return true;
    }
    function checkUnit(){
        var unit=$("#unit").val();
        var msg=$("#msgUnit");
        var reg=/^[0-9]+$/;
        msg.html("");
        if(unit==null || $.trim(unit)==""){
            msg.html("*号为必填项");
            $("#unit").removeClass("cler");
            $("#unit").addClass("red");
            return false;
        }
        if(reg.test(unit)){
            msg.html("请输入正确的交易单位！");
            $("#unit").removeClass("cler");
            $("#unit").addClass("red");
            return false;
        }
        $("#unit").addClass("cler");
        return true;
    }
    function checkCounts(){
        var counts=$("#counts").val();
        var msg=$("#msgCounts");
        var reg=/^[0-9]+$/;
        msg.html("");
        if(counts==null || $.trim(counts)==""){
            msg.html("*号为必填项");
            $("#counts").removeClass("cler");
            $("#counts").addClass("red");
            return false;
        }
        if(!reg.test(counts)){
            msg.html("请输入正确的交易数量！");
            $("#counts").removeClass("cler");
            $("#counts").addClass("red");
            return false;
        }
        $("#counts").addClass("cler");
        return true;
    }


    function check(){
        if(checkName()&&checkUnit()&&checkCounts()&&checkMoney()){
            return true;
        }else{
            return false;
        }
    }

</script>
</html>
